.list {
    width: 100%;
}

.list ul {
    list-style: none;
}

.list>ul>li {
    width: 100%;
    -webkit-transition: .3s ease;
    -moz-transition: .3s ease;
    -o-transition: .3s ease;
    transition: .3s ease;
}

.list>ul>li p[class=title] {
    width: 100%;
    text-align: center;
    border-top: 1px solid #37414b;
    border-bottom: 1px solid #1f262d;
    color: #fff;
    font-size: 13px;
    height: 38px;
    line-height: 38px;
    position: relative;

	margin-bottom: 0;
}

.list>ul>li p[class=title]>span {
    position: absolute;
    right: 10%;
}

.list-se {
    overflow: hidden;
    display: none;
}

.list-se>p {
    background: #444 !important;
    color: #ee4977;
}

.list-se>li {
    position: relative;
    right: -100%;
    -webkit-transition: right .5s;
    -moz-transition: right .5s;
    -o-transition: right .5s;
    transition: right .5s;
}

.list-se>li>p {
    background: #3b3b3b;
    color: #f0f0f0;
    height: 50px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 10px;
    line-height: 50px;
    border-left: 5px solid #3b3b3b;
    -webkit-transition: border .5s;
    transition: border .5s;
    -webkit-transition: background .3s;
    transition: background .3s;
}

.list-se>li>p:hover {
    border-color: #EE4977;
    background: #5b5b5b;
}